/// @desc 创建一个由多个无状态的widget组装而成的有状态的widget，一个用于事件，一个用于展示
/// 
/// @usage 责任的分离将更大的复杂性封装在各个 widget 中，保证了父级的简单性。
import 'package:flutter/material.dart';

class CounterDisplay extends StatelessWidget {
  const CounterDisplay({required this.count, Key ? key}) : super(key: key);

  final int count;

  @override
  Widget build(BuildContext context) {
    return Text('count: $count');
  }
}

class CounterIncrementor extends StatelessWidget {
  const CounterIncrementor({required this.onPressed, Key ? key}) : super(key: key);

  final VoidCallback onPressed;

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: onPressed,
      child: const Text('Increment'),
    );
  }
}

class Counter0105 extends StatefulWidget {
  const Counter0105({Key ? key}): super(key: key);

  @override
  _CounterState createState () => _CounterState();
}

class _CounterState extends State<Counter0105> {
  int _counter = 0;

  void _increment () {
    setState(() {
      ++_counter;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Row(mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      CounterIncrementor(onPressed: _increment),
      const SizedBox(width: 16),
      CounterDisplay(count: _counter),
    ],
    );
  }
}